*{
    margin:0;
    padding:0;
}

body{
    height:100%;
    display:flex;
	flex-direction:column;
}

#header{
    display: flex;
    height: 1.333333rem;
    background:rgb(255,132,29);
    .a1{
        display:inline-block;
        font: 22px/ 1.333333rem "";
        padding-left: .266667rem;
        text-decoration: none;
    }
    p{
        display:inline-block;
        font: 20px/ 1.333333rem "";
        font-weight: 900;
        color:white;
        margin:0 auto;
    }
    img{
        height:.906667rem;
        width:.906667rem;
        padding:.266667rem .266667rem 0 0;
    }
}

#nav{
    ul{
        display:flex;
        height:1.333333rem;
        overflow: auto;
        li{
            list-style:none;
            border-bottom: .08rem solid white;
            a{
                width:1.6rem;
                display:inline-block;
                font:16px/1.333333rem "";
                text-align: center;
            }
        }
    }
}

#content{
    background:rgb(241,241,241);
    .content-box{
        height:4.266667rem;
        margin-top:.213333rem;
        background:white;
        display:flex;
    
        .left{
            height:3.466667rem;
            width:3.6rem;
            margin-left: .266667rem;
            margin-top:.213333rem;
            img{
                height:3.466667rem;
                width:3.6rem; 
            }
        }
        .right{
            // display:block;
            padding-left: .266667rem;
            margin-top:.213333rem;
            h4{
                font:18px/.48rem "";
                margin-bottom:.266667rem;
            }
            .p1{
                font:24px/.853333rem "";
                margin-bottom:.266667rem;
                color:red;
                i{
                    text-decoration: none;
                    font:18px/.533333rem "";
                    color:red;
                }
                em{
                    text-decoration: none;
                    font:18px/.533333rem "";
                    color:red;
                }
                del{
                    font:12px/.426667rem "";
                    color:#ccc;
                }
            }
            .down{
                position:relative;
                #bar{
                    display:inline-block;
                    height:.48rem;
                    width:2.933333rem;
                    background:rgb(255,183,183);
                    border:.026667rem solid red;
                    border-radius: .266667rem;
                    display:flex;
                    align-items: center;
                    #aside{
                        background:red;
                        height:100%;
                        border-radius: .266667rem;
                        color:white;
                        text-align: center;
                    }
                }
                b{
                    color:red;
                    font:10px/.906667rem "";
                    position:absolute;
                    right:.133333rem;
                    top:-0.266667rem;
                
                }
            }
            
            .div{
                padding-top: .266667rem;
                a:nth-of-type(1){
                    display:inline-block;
                    text-decoration: none;
                    width:3.733333rem;
                    font:14px/.64rem "";
                    text-align: center;
                    color:red;
                    border: .026667rem dashed red;
                }
                a:nth-of-type(2){
                    background:red;
                    text-decoration: none;
                    display:inline-block;
                    width:1.866667rem;
                    color:white;
                    font:14px/.666667rem"";
                    text-align: center;
                    border-radius: .266667rem;
                }
            }
        }
    
    }
}

#footer{
    background:rgb(239,239,239);
    .a1 {
        text-decoration: none;
        color: #666;
        display: block;
        width:9.466667rem;
        margin:.266667rem;
        font-size: .373333rem;
        line-height: .8rem;
        border-radius: .133333rem;
        text-align: center;
        border: .026667rem solid #ddd;
        background-image: linear-gradient(#fff, #f4f4f4)
    }
    .rank {
        background: #ff841d;
        height: .906667rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-left: .266667rem;
        margin-top: .266667rem;
        .span1 {
            font-size: .48rem;
            line-height:.906667rem;
            color: white;
        }
        .a2{
            text-decoration: none;
            display:inline-block;
            height:.533333rem;
            width:.533333rem;
            background: #ff841d;
            padding-right:.266667rem ;
            img {
                width:.533333rem;
                height: .533333rem;
            }
        }
    }
    ul{
        margin-top:.533333rem;
       display:flex;
       li{
           flex:1;
           list-style: none;
           text-align: center;
           font: 16px / .88rem "";
           border:.026667rem solid #ccc;
           color:#666;
           a{
               text-decoration: none;
               color:#666;
           }
       }
    }
    .bottom{
        height:1.493333rem;
        .p1{
            padding-top:.266667rem;
            font-size:.373333rem; 
            text-align: center;
            .span1{
                color:red;
            }
            .span3{
                color:rgb(110,110,110);
            }
        }
        .p2{
            font-size: .32rem;
            text-align: center;
            color:rgb(110,110,110);
        }
    }
}
.active{
    color: red !important;
    border-bottom:.08rem solid red!important;
}




